<template>
  <view class="app-content">
    <!-- 导航栏 -->
    <uni-nav-bar ref="navBar" status-bar="true" left-icon="back" background-color="#253155" color="white" :shadow="false" :right-margin="capsuleLeft" title="Preview" @clickLeft="uni.navigateBack()" />
    <render :component-list="componentList" :device-id="0" :preview="true" />
  </view>
</template>

<script>
import uniNavBar from '@/components/uni-nav-bar/uni-nav-bar.vue'
export default {
  components: { uniNavBar },
  data() {
    return {
      uni,
      // #ifdef MP
      capsuleLeft: this.$api.config.sysInfo.screenWidth - this.$api.config.capsule.left,
      // #endif
      // #ifndef MP
      capsuleLeft: 0,
      // #endif
      controllerId: undefined,
      componentList: []
    }
  },
  onLoad(options) {
    // 从options中获取Id
    const id = options.id
    if (id) {
      this.controllerId = parseInt(id)
      this.$api.request('controller', 'listComponent', {
        controllerId: this.controllerId
      }).then(res => {
        // 将component attr 转换为Map结构，方便使用
        res.data.forEach(item => {
          const attrObj = {}
          item.attrList.forEach(sitem => {
            attrObj[sitem.idTag] = sitem
            if (sitem.type === 1) {
              // 数字
              if (sitem && sitem.value) {
                attrObj[sitem.idTag + 'V'] = parseInt(sitem.value)
              }
            } else if (sitem.type === 2) {
              if (sitem && sitem.value) {
                attrObj[sitem.idTag + 'V'] = sitem.value
              } else {
                attrObj[sitem.idTag + 'V'] = ''
              }
            } else if (sitem.type === 3) {
              if (sitem && sitem.value) {
                attrObj[sitem.idTag + 'V'] = parseFloat(sitem.value)
              }
            } else if (sitem.type === 4) {
              if (sitem && sitem.value) {
                attrObj[sitem.idTag + 'V'] = (sitem.value === 'true')
              }
            } else if (sitem.type === 5) {
              if (sitem && sitem.value) {
                attrObj[sitem.idTag + 'V'] = sitem.value
              } else {
                attrObj[sitem.idTag + 'V'] = ''
              }
            } else if (sitem.type === 6) {
              if (sitem && sitem.value) {
                attrObj[sitem.idTag + 'V'] = sitem.value
              } else {
                attrObj[sitem.idTag + 'V'] = ''
              }
            }
          })
          item.attr = attrObj
        })
        this.componentList = res.data
      })
    }
  },
  methods: {
  }
}
</script>

<style>

</style>
